import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class MyAppBar extends StatefulWidget implements PreferredSizeWidget {
  final bool isBack;
  final String backImg;
  final Color backBgColor;

  final String? title;
  final Color? titleColor;
  final Color? bgColor;
  final Widget? rightMenu;
  final SystemUiOverlayStyle? style;
  final bool showDivider;
  final Color dividerColor;

  MyAppBar(
      {this.isBack: true,
      this.backImg = 'assets/images/ic_back.png',
      this.backBgColor = Colors.black,
      this.title,
      this.titleColor,
      this.bgColor,
      this.rightMenu,
      this.style,
      this.showDivider = false,
      this.dividerColor = const Color(0xFFEEEEEE)});

  @override
  State<StatefulWidget> createState() => _MyAppBarState();

  @override
  Size get preferredSize => Size.fromHeight(48.w);
}

class _MyAppBarState extends State<MyAppBar> {
  @override
  Widget build(BuildContext context) {
    Widget back = InkWell(
        onTap: () {
          Navigator.pop(context);
        },
        child: Container(
          constraints: BoxConstraints(
            maxWidth: 50.w,
          ),
          padding: EdgeInsets.only(left: 12.w, right: 12.w),
          alignment: Alignment.centerLeft,
          child: Image(
            image: AssetImage(widget.backImg),
            width: 20.w,
            height: 20.w,
            color: widget.backBgColor,
          ),
        ));

    Widget title = Center(
      child: Text(
        widget.title ?? '',
        style: TextStyle(
            fontSize: 18.sp, color: widget.titleColor ?? Color(0xff333333)),
      ),
    );

    Widget right = Positioned(
      top: 0,
      bottom: 0,
      right: 0,
      child: widget.rightMenu ?? Container(),
    );

    Widget dividerLine = widget.showDivider
        ? Positioned(
            left: 0,
            right: 0,
            bottom: 0,
            child: Container(
              height: 1.w,
              color: widget.dividerColor,
            ))
        : Container();

    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: widget.style ?? SystemUiOverlayStyle.dark,
      child: Container(
        color: widget.bgColor ?? Colors.white,
        child: SafeArea(
          child: Container(
            height: 48.w,
            child: Stack(
              children: [
                //返回按钮
                widget.isBack ? back : Container(),
                //标题
                title,
                //右侧菜单
                right,
                //底部分割线
                dividerLine,
              ],
            ),
          ),
        ),
      ),
    );
  }
}
